const path = require('path');
const webpack = require('webpack');

const { merge } = require('webpack-merge');
// const ESLintPlugin = require('eslint-webpack-plugin');
const commonConfig = require('./webpack.config.common.js');

const devConfig = {
    mode: 'development',
    entry: './src/main.js',
    output: {
        filename: 'index.js',
        path: path.resolve(__dirname, 'dist')
    },
    devServer: {
        port: 9999,
        hot: true
    },
    devtool: 'cheap-module-eval-source-map',
    module: {
        rules: [{
                test: /\.css$/,
                use: [{
                        loader: "style-loader"
                    },
                    {
                        loader: "css-loader",
                        options: {
                            importLoaders: 1
                        }
                    },
                    {
                        loader: "postcss-loader"
                    }
                ]
            },
            {
                test: /\.scss$/,
                use: [
                    'style-loader',
                    {
                        loader: 'css-loader',
                        options: {
                            importLoaders: 2
                        }
                    },
                    'postcss-loader',
                    'sass-loader'
                ]
            }
        ]
    },
    plugins: [

        new webpack.HotModuleReplacementPlugin()
    ]
};

module.exports = merge(devConfig, commonConfig);